<div class="fujian">
  <div class="fujian-list">
    <div class="fujian-item" *ngFor="let file of selectedFiles; let i = index">
      <div class="fujian-img-border" (mouseover)="hovering[i] = true" (mouseout)="hovering[i] = false" [title]="file.url">
        <div class="fujian-data">

        <img *ngIf="file.name.endsWith('jpg') || file.name.endsWith('png') || file.name.endsWith('gif') || file.name.endsWith('bmp') || file.name.endsWith('webp')" [src]="file.url" class="fujian-img">

        <svg class="icon" aria-hidden="true" *ngIf="file.name.endsWith('.xls') || file.name.endsWith('.xlsx')">
          <use xlink:href="#icon-EXCEL"></use>
        </svg>
        <svg class="icon" aria-hidden="true" *ngIf="file.name.endsWith('.doc') || file.name.endsWith('.docx')">
          <use xlink:href="#icon-WORD"></use>
        </svg>

        <!-- 对于 PowerPoint 文件 -->
        <svg class="icon" aria-hidden="true" *ngIf="file.name.endsWith('.ppt') || file.name.endsWith('.pptx')">
          <use xlink:href="#icon-PPT"></use>
        </svg>

        <!-- 对于 PDF 文件 -->
        <svg class="icon" aria-hidden="true" *ngIf="file.name.endsWith('.pdf')">
          <use xlink:href="#icon-PDF"></use>
        </svg>

        <!-- 对于 TXT 文件 -->
        <svg class="icon" aria-hidden="true" *ngIf="file.name.endsWith('.txt')">
          <use xlink:href="#icon-TXT"></use>
        </svg>
        </div>
        <div class="fujian-set">
          <span><a class="devui-link-danger me-2" (click)="removeFile(i)">删除</a></span><span><a class="devui-link" [href]="file.url">查看</a> </span>
        </div>
      </div>
      <span class="fujian-item-name" [title]="file.name">{{file.name}}</span>
    </div>
    <input type="file" #fileInput style="display: none" (change)="handleFileInput($event)"/>
    <div class="fujian-img-border"(click)="fileInput.click()" *ngIf="data.type!='查看'">
      <span class="fujian-img">+</span>
    </div>
    <div class="fujian-img-border" *ngIf="data.type=='查看'&&selectedFiles.length==0">
      暂未上传附件信息
    </div>
  </div>
</div>
